<template>
  <t-tabs v-model="tabValue">
    <t-tab-panel value="1" label="论文信息">
      <t-form ref="form" class="step-form" labelWidth="120px" :colon="true">
        <t-row style="flex: 1">
          <t-col :span="12">
            <t-row style="row-gap:6px">
              <t-col :span="12">
                <t-form-item label="论文名称" name="name">
                  {{ objData.name }}
                </t-form-item>
              </t-col>
              <t-col :span="6">
                <t-form-item label="刊号(ISSN)" name="issn">
                  {{ objData.issn }}
                </t-form-item>
              </t-col>
              <!--              <t-col :span="6">-->
              <!--                <t-form-item label="主办单位" name="hostDept">-->
              <!--                  {{objData.hostDept}}-->
              <!--                </t-form-item>-->
              <!--              </t-col>-->
              <t-col :span="6">
                <t-form-item label="刊物名称" name="publicationName">
                  {{ objData.publicationName }}
                </t-form-item>
              </t-col>
              <!--            <t-col :span="6">-->
              <!--              <t-form-item label="个人排名" name="thesisRanking">-->
              <!--                <t-select style="width:390px" clearable filterable v-model="formData0.thesisRanking" :options="dict.type.thesis_ranking">-->
              <!--                </t-select>-->
              <!--              </t-form-item>-->
              <!--            </t-col>-->
              <t-col :span="6">
                <t-form-item label="出版年月" name="publishDate">
                  {{ objData.publishDate }}
                </t-form-item>
              </t-col>
              <!--              <t-col :span="6">-->
              <!--                <t-form-item label="完成字数" name="completeWordCount">-->
              <!--                  {{objData.completeWordCount}}(千字)-->
              <!--                </t-form-item>-->
              <!--              </t-col>-->
              <t-col :span="6">
                <t-form-item label="级别" name="paperLevel">
                  {{ objData.paperLevel | filterByDict(dict.type.paper_level) }}
                </t-form-item>
              </t-col>
              <t-col :span="6">
                <t-form-item label="检索验证地址" name="verifyAddress">
                  {{ objData.verifyAddress }}
                </t-form-item>
              </t-col>
              <t-col :span="6">
                <t-form-item label="填报单位" name="declareDeptName">
                  {{ objData.declareDeptName }}
                </t-form-item>
              </t-col>
              <t-col :span="6">
                <t-form-item label="关键词" name="keyWord">
                  {{ objData.keyWord }}
                </t-form-item>
              </t-col>
              <t-col :span="12">
                <t-form-item label="摘要" name="digest">
                  {{ objData.digest }}
                </t-form-item>
              </t-col>
              <!--              <t-col :span="12">-->
              <!--                <t-form-item label="备注" name="note">-->
              <!--                  {{objData.note}}-->
              <!--                </t-form-item>-->
              <!--              </t-col>-->
            </t-row>
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
    <t-tab-panel value="2" label="论文人员">
      <thesis-member :objId="objId" v-model="objData.memberList" :editOpen="false"></thesis-member>
    </t-tab-panel>
    <t-tab-panel value="4" label="论文项目来源">
      <thesis-project :objId="objId" ref="thesis-project" v-model="objData.projectList" :editOpen="false"
        style="height: 58vh;width: 100%; overflow: auto; overflow-x: hidden;"></thesis-project>
    </t-tab-panel>
    <t-tab-panel value="5" label="附件信息">
      <t-table row-key="id" :columns="projectFileColumns" :data="projectFileData">
        <template #id="{ row, rowIndex }">
          {{ rowIndex + 1 }}
        </template>
        <template #c1="{ row }">
          <a v-if="row.c3" class="t-button-link" :href="`${file_domain}/${row.c3}`" target="_blank">{{ row.c1 }}</a>
          <div v-else>{{ row.c1 }}</div>
        </template>
        <template #op="{ row }">
          <div v-for="(item, index) in row.fileLists" :key="index">
            <a class="t-button-link" target="_blank" :href="item.url">
              {{ item.name }}
            </a>
          </div>
        </template>
      </t-table>
    </t-tab-panel>
  </t-tabs>
</template>

<script>
import { VITE_FILE_DOMAIN } from '@/api/upload'
import { getFiles } from "@/api/common";
import thesisMember from "./thesis-member.vue";
import thesisProject from "./thesis-project.vue";

export default {
  name: "thesis-detail",
  dicts: ["paper_level"],
  components: {
    thesisMember,
    thesisProject
  },
  props: {
    objId: [String, Number],
  },
  data () {
    return {
      site_tag: import.meta.env.VITE_SITE_TAG,
      file_domain: VITE_FILE_DOMAIN,
      tabValue: '1',
      objData: {},
      projectFileData: [
        // {
        //   id: 1,
        //   c1: "期刊封面",
        //   c2: "是",
        //   moduleKey: "thesisQKFM",
        //   fileIds: [],
        //   fileLists: [],
        //   require: true,
        // },
        // {
        //   id: 2,
        //   c1: "期刊目录",
        //   c2: "是",
        //   moduleKey: "thesisQKML",
        //   fileIds: [],
        //   fileLists: [],
        //   require: true,
        // },
        // {
        //   id: 3,
        //   c1: "期刊版权页,检索证明",
        //   c2: "是",
        //   moduleKey: "thesisQKBQY",
        //   fileIds: [],
        //   fileLists: [],
        //   require: true,
        // },
        {
          id: 1,
          c1: "正文",
          c2: "是",
          moduleKey: "thesisZW",
          fileIds: [],
          fileLists: [],
          require: true,
        },
        {
          id: 4,
          c1: "其他",
          c2: "否",
          fileIds: [],
          fileLists: [],
          moduleKey: "cgzhlwqt",
          require: false
        },
      ],
      projectFileColumns: [
        {
          colKey: "id",
          title: "序号",
          align: "center",
          width: 64
        },
        {
          colKey: "c1",
          title: "附件名称",
          align: "center",
        },
        {
          colKey: "c2",
          title: "是否必需",
          align: "center",
        },
        {
          colKey: "op",
          title: "附件列表",
          align: "left",
        },
      ],
    }
  },
  watch: {
    objId: {
      immediate: true,
      handler (val) {
        if (val) {
          this.getObj(val);
        }
      }
    },
  },
  methods: {
    getObj () {
      // 获取项目附件
      getFiles(this.objId).then((res) => {
        const files = {}
        res.data.forEach((item) => {
          if (!files[item.moduleKey]) {
            files[item.moduleKey] = []
          }
          files[item.moduleKey].push({
            name: item.fileName,
            url: item.fullFilePath,
            id: item.id,
            filePath: item.filePath
          })
        })
        this.projectFileData.forEach((val, index) => {
          this.projectFileData[index].fileLists = files[val.moduleKey] || [];
          this.projectFileData[index].fileIds = files[val.moduleKey]?.map(val => val.id) || [];
        })

      }).catch((e) => {
        this.$message.error(e.toString());
      });
      this.$api.cgzh.thesis.get(this.objId).then(response => {
        this.objData = response.data;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    }
  }
}
</script>

<style lang="less" scoped>
.t-tab-panel {
  padding: 10px;
}

.t-form__item {
  margin-bottom: 6px
}
</style>
